<!DOCTYPE html>
<html >
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="/static/layui/css/layui.css"/>
    <script src="/static/js/jquery.js"></script>
    <script src="/static/layui/layui.js"></script>
</head>
<body>



<form class="layui-form" action="" id="form1">
    {% csrf_token %}
<br>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">角色名称</label>
            <div class="layui-input-inline">
                <input type="text" name="userName" required   autocomplete="off" class="layui-input layui-from">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-inline">
                <input type="text" name="userDescribe"  required    autocomplete="off" class="layui-input layui-from">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">邮箱</label>
            <div class="layui-input-inline">
                <input type="text" name="userEmail"  required    autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">密码</label>
            <div class="layui-input-inline">
                <input type="text" name="userPwd"  required    autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">确认密码</label>
            <div class="layui-input-inline">
                <input type="text" name="userPwd2"  required    autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">主项目</label>
            <div class="layui-input-inline">
                <select name="projectId" lay-filter="Type_filter" id="projectId" lay-verify="required" >
	            <option value="" data-i18n="GuideStatusOption0">请选择</option>
                </select>
            </div>
        <div class="layui-inline">
            <label class="layui-form-label">角色</label>
            <div class="layui-input-inline">
                <select name="roleId" lay-filter="Type_filter" id="roleId" lay-verify="required" >
	            <option value="" data-i18n="GuideStatusOption0">请选择</option>
                </select>
            </div>
        </div>
    </div>

    {% comment %}<div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-inline">
                <input type="tel" name="gender" required  autocomplete="off" class="layui-input">
            </div>
        </div>
        <!--<div class="layui-inline">
            <label class="layui-form-label">生日</label>
            <div class="layui-input-inline">
                <input type="text" name="birthday" id="date"  placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
            </div>
        </div>-->
        <div class="layui-inline">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-inline">
                <input type="text" name="phone" required  autocomplete="off" class="layui-input">
            </div>
        </div>


    </div>{% endcomment %}

    {% comment %}<div class="layui-form-item">

        <div class="layui-inline">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-inline">
                <input type="text" name="address"  required   autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">创建时间</label>
            <div class="layui-input-inline">
                <input type="text" name="creationDate" required  id="date1"  placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
            </div>
        </div>



    </div>{% endcomment %}


</form>
<div class="layui-form-item">
    <div class="layui-input-block">
        <button type="submit" onclick="doSave()" class="layui-btn" >创建</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
</div>

<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
    var roleData ;
    var projectData;
$(function(){

    var  index = -1;
    $.ajax({
        url:"/wyh0282/roleJson",    //请求的url地址
        dataType:"json",   //返回格式为json
        async:true,//请求是否异步，默认为异步，这也是ajax重要特性
        type:"GET",   //请求方式
        success:function(req){
            roleData = req.data
            for (var i = 0; i < roleData.length; i++){
                $('#roleId').append(new Option(roleData[i].name));// 下拉菜单里添加元素++

            }
            layui.form.render('select');
        },
        error:function(){
            alert("失败")
        }
    });
    $.ajax({
        url:"/wyh0282/projectJson",    //请求的url地址
        dataType:"json",   //返回格式为json
        async:true,//请求是否异步，默认为异步，这也是ajax重要特性
        type:"GET",   //请求方式
        success:function(req){
            projectData = req.data
            for (var i = 0; i < projectData.length; i++){
                $('#projectId').append(new Option(projectData[i].name));// 下拉菜单里添加元素++

            }
            layui.form.render('select');
        },
        error:function(){
            alert("失败")
        }
    });




})
   var $,layer;
   layui.use(['form','laydate'],function () {
       var laydate=layui.laydate;
       $=layui.jquery;
       layer=layui.layer;

       laydate.render({
           elem: '#date1'
       });
       laydate.render({
           elem: '#date'
       });

   })

   /* layui.use(['form','laydate'],function (){

       var laydate = layui.laydate;

       $=layui.jquery;
       layer=layui.layer;

        //日期
        laydate.render({
            elem: '#date'
        });

    })*/
/*
   function doSave() {
       var requestData=$("form1").serialize();
        $.post("/userm/save",requestData,function (responseData) {
            if (responseData.success==1){
                parent.layer.alert("添加成功",{yes:function () {
                        parent.layer.closeAll();
                        window.parent.location.reload();
                    }});
            }
        });
   }*/



    function doSave() {
        var requestData = $("#form1").serialize();
        $.post("/wyh0282/userCreate/",requestData,function (responseData) {
            if(responseData.code == 1){
               parent.layer.alert("创建用户成功",{yes:function () {
                       parent.layer.closeAll();
/*
                       window.parent.location.reload();
*/
                   }});
            }else{
                 parent.layer.alert(responseData.msg,{yes:function () {
                       parent.layer.closeAll();
/*
                       window.parent.location.reload();
*/
                   }});
            }

        });
    }



</script>
<script>
layui.use('dropdown', function(){
  var dropdown = layui.dropdown
  dropdown.render({
    elem: '#demo1' //可绑定在任意元素中，此处以上述按钮为例
    ,data: [{
      title: 'menu item 1'
      ,id: 100
      ,href: '#'
    }]
    ,id: 'demo1'
    //菜单被点击的事件
    ,click: function(obj){
      alert(obj);
      layer.msg('回调返回的参数已显示再控制台');
    }
  });
});
</script>
</body>
</html>